<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>统计</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/static/css/layui.css" media="all">
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
<div class="x-body">
    <div>
        <form class="layui-form layui-form-pane" method="get" id="myForm" onsubmit="return false">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">客户:</label>
                    <div class="layui-input-inline" style="width:120px;">
                        <input class="layui-input" name="mem" autocomplete="off"/>
                    </div>
                </div>
                <button type="button" class="layui-btn" lay-filter="search" lay-submit="" id="search">查询</button>
                <button type="button" class="layui-btn layui-btn-normal" lay-filter="add" lay-submit="" id="add">新增客户</button>
            </div>
        </form>
    </div>
    <div id="memForm" style="display: none">
        <div class="layui-form-item">
        <h4 id="comHeader"></h4>
        </div>
        <form class="layui-form" action="" id="resultForm" onsubmit="return false">
            <input type="hidden" name="cid" id="cid">
            <div class="layui-form-item" >
                <label class="layui-form-label">兴趣</label>
                <div class="layui-input-block" id="interest">
                </div>
            </div>
            <div class="layui-form-item" >
                <label class="layui-form-label">借口</label>
                <div class="layui-input-block" id="excuse">
                </div>
            </div>
            <div class="layui-form-item">
                <button type="button" class="layui-btn layui-btn-normal" id="addEx">新增借口</button>
                <button type="button" class="layui-btn layui-btn-normal" id="addIn">新增兴趣</button>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">单选框</label>
                <div class="layui-input-block">
                    <input type="radio" name="done" value="1" title="成交">
                    <input type="radio" name="done" value="0" title="未成交" checked>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="resultForm">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary" id="reset">重置</button>
                </div>
            </div>
        </form>

    </div>
</div>
</body>

<script src="/static/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
    layui.use(['layer', 'form'], function () { //独立版的layer无需执行这一句
        var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句
        layui.form.on('submit(search)', function (data) {
            if (data.field.mem == '') {
                lay_err('客户必填')
            }
            $.get({
                'url': 'member',
                data: data.field,
                success(e) {
                    if(e.code){
                        lay_err(e.msg)
                    }else {
                        if(e.info===null){
                            lay_err('没有这家公司')
                        }else {
                            formShow(e.info.name,e.info.tel,e.info.employees,e.info.id)
                        }
                    }

                },
                error() {
                    lay_err('网络请求失败')
                }

            });
            return false;
        });
        layui.form.on('submit(add)', function (data) {
            layer.open({
                fix: false, //不固定
                maxmin: true,
                type: 1,
                title: '新增客户',
                content: ' <form class="layui-form layui-form-pane" method="get" id="memberForm" onsubmit="return false">\n' +
                    '        <div class="layui-form-item">\n' +
                    '\n' +
                    '            <div>\n' +
                    '                <label class="layui-form-label">名称:</label>\n' +
                    '                <div class="layui-input-inline">\n' +
                    '                    <input class="layui-input" lay-verify="required"  name="name" autocomplete="off"/>\n' +
                    '                </div>\n' +
                    '            </div>\n' +
                    '            <div>\n' +
                    '                <label class="layui-form-label">电话:</label>\n' +
                    '                <div class="layui-input-inline">\n' +
                    '                    <input class="layui-input" lay-verify="required"  name="tel" autocomplete="off"/>\n' +
                    '                </div>\n' +
                    '            </div>\n' +
                    '            <div>\n' +
                    '                <label class="layui-form-label">参保人数:</label>\n' +
                    '                <div class="layui-input-inline">\n' +
                    '                    <input class="layui-input" lay-verify="required"  name="employees" autocomplete="off"/>\n' +
                    '                </div>\n' +
                    '            </div>\n' +
                    '            <button type="button" class="layui-btn layui-btn-normal" lay-filter="addMem" lay-submit="">新增</button>\n' +
                    '        </div>\n' +
                    '    </form>'
            });
            return false;
        });
        layui.form.on('submit(addMem)', function (data) {
            $.post({
                'url':'member',
                'data':data.field,
                success(e){
                    if(e.code){
                        lay_err(e.msg)
                    }else {
                        layer.closeAll();
                        lay_succ('新增成功')
                    }
                },
                error(e){
                    lay_err(e)
                }
            })
        })
        layui.form.on('submit(answer)', function (data) {
          $.post({
              'url':'answer',
              data:data.field,
              success(e){
                  if(e.code){
                      lay_err(e.msg)
                  }else {
                      checkGet()
                  }
              }
          })
        })
        layui.form.on('submit(resultForm)', function (data) {
            $.post({
                url:'result',
                data:data.field,
                success(e){
                    if(e.code){
                        lay_err(e.msg)
                    }else {
                        $('#memForm').hide()
                        $('#comHeader').html()
                        $('#cid').val()
                        $('#reset').click()
                    }
                },
                error(){
                    lay_err('请求错误')
                }
            })
        })
        $('#addEx').click( function (data) {
            layer.open({
                fix: false, //不固定
                type: 1,
                title: '新增借口',
                content: '<form class="layui-form" action="" onsubmit="return false">\n' +
                    '            <div class="layui-form-item">\n' +
                    '                <div class="layui-inline">\n' +
                    '                    <label class="layui-form-label">内容:</label>\n' +
                    '                    <div class="layui-input-inline" style="width:120px;">\n' +
                    '                        <input class="layui-input" name="info" autocomplete="off"/>\n' +
                    '                    </div>\n' +
                    '                </div>\n' +
                    '            </div>'+
                    '<input type="hidden" name="type" value="1">'+
                    '            <div class="layui-form-item">\n' +
                    '                <div class="layui-input-block">\n' +
                    '                    <button class="layui-btn" lay-submit lay-filter="answer">立即提交</button>\n' +
                    '                </div>\n' +
                    '            </div>\n' +
                    '        </form>'
            });

        })
        $('#addIn').click( function () {
            layer.open({
                fix: false, //不固定
                type: 1,
                title: '新增兴趣',
                content: '<form class="layui-form" action="" onsubmit="return false">\n' +
                    '            <div class="layui-form-item">\n' +
                    '                <div class="layui-inline">\n' +
                    '                    <label class="layui-form-label">内容:</label>\n' +
                    '                    <div class="layui-input-inline" style="width:120px;">\n' +
                    '                        <input class="layui-input" name="info" autocomplete="off"/>\n' +
                    '                    </div>\n' +
                    '                </div>\n' +
                    '            </div>'+
                        '<input type="hidden" name="type" value="2">'+
                    '            <div class="layui-form-item">\n' +
                    '                <div class="layui-input-block">\n' +
                    '                    <button class="layui-btn" lay-submit lay-filter="answer">立即提交</button>\n' +
                    '                </div>\n' +
                    '            </div>\n' +
                    '        </form>'
            });

        })

        function lay_err(msg) {
            msg = msg || '操作失败';
            layer.msg(msg, { icon: 2 });
        }

        function lay_succ(msg) {
            msg = msg || '操作成功';
            layer.msg(msg, { icon: 1 });
        }
        function formShow(com,tel,employees,id) {
            $('#memForm').show()
            $('#comHeader').html("<span>公司名： "+com+" </span><span>电话："+tel+"   </span><span>参保人数："+employees+"</span>")
            $('#cid').val(id)
        }
        function checkGet() {
            $.get({
                'url':'answer',
                success(e){
                    if(e.code){
                        lay_err(e.msg)
                    }else {
                        interest = ''
                        excuse = ''
                        $.each(e.info,function () {
                            if(this.type==2) {
                                interest += ' <input type="checkbox" name="interest['+this.id+']" value="1" title="'+this.info+'"><br>'
                            }else{
                                excuse += ' <input type="checkbox" name="excuse['+this.id+']" value="1" title="'+this.info+'"><br>'
                            }
                        })
                        layer.closeAll()
                        $('#interest').html(interest)
                        $('#excuse').html(excuse)
                        layui.form.render('checkbox')
                    }
                },
                error(e){
                    lay_err(e)
                }
            })
        }
        checkGet()
    });
</script>

</html>